<template>
  <div class="tuangou">
    <div class="header">
      <span @click="bock">←</span>
      <h4>新建团购</h4>
      <span></span>
    </div>
    <div class="main">
      <div class="normal">
        <button>+</button>
        <van-uploader v-model="fileList" multiple />
      </div>
      <input type="text" placeholder="请输入团购标题" v-model="form.name" />
      <input type="text" placeholder="请输入楼盘地址" v-model="form.dizhi" />
      <input type="text" placeholder="请选择开始日期" v-model="form.time" />
      <input type="text" placeholder="请选择结束日期" v-model="form.overtime" />
      <input type="text" placeholder="请输入团购介绍" v-model="form.jieshao" class="ipt" />
      <button @click="Add" class="btn">创建团购</button>
    </div>
  </div>
</template>
<script>
import axios from "../../src/axios/index";
import api from "../api/index";
export default {
  name: "Tuan",
  data() {
    return {
      fileList: [],
      form: {
        img: "",
        name: "",
        dizhi: "",
        time: "",
        overtime: "",
        jieshao: ""
      }
    };
  },
  methods: {
    Add() {
      axios
        .get("/tuangouup", {
          params: {
            img: this.form.img,
            name: this.form.name,
            dizhi: this.form.dizhi,
            time: this.form.time,
            overtime: this.form.overtime,
            jieshao: this.form.jieshao
          }
        })
        .then(res => {
          alert("添加成功");
          this.$router.push('/tuan')
        });
    },
    bock(){
      this.$router.push('/index')
    }
  }
};
</script>
<style scoped>
.tuangou {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}
.header {
  width: 100%;
  height: 50px;
  background: #2e9bfc;
  display: flex;
  justify-content: space-around;
  color: #fff;
  line-height: 50px;
}
.header img {
  width: 90px;
  height: 30px;
  padding: 10px 5px;
}
.main {
  width: 100%;
  height: auto;
  flex: 1;
  overflow-y: scroll;
}
.normal {
  width: 96%;
  height: 231px;
  border: 2px solid #ccc;
  text-align: center;
  line-height: 231px;
  margin-left: 5px;
  margin-top: 5px;
}
.normal input {
  border: none;
}
.normal button {
  border: none;
  background: #fff;
}
input {
  width: 96%;
  height: 40px;
  margin-left: 5px;
  margin-top: 5px;
}
.ipt {
  height: 80px;
}
.btn {
  width: 100%;
  height: 50px;
  background: #169bd5;
  color: #fff;
  border: none;
  margin-top: 35px;
}
</style>
